<template>
  <div id="player">
    <!-- <h2 class="title">黑云音乐</h2> -->
    <!-- 轮播图 -->
    <MySwiper></MySwiper>
    <div class="search">
      <input type="text" />
      <button>
        <span class="iconfont icon-search"></span>
      </button>
    </div>
    <div class="tab-wrapper">
      <!-- tab栏 -->
      <div class="tab-bar">
        <a class="bar-item active"> 搜索结果 </a>
        <a class="bar-item"> 歌曲播放 </a>
        <a class="bar-item"> mv </a>
        <a class="bar-item"> 歌曲评论 </a>
        <a class="bar-item"> 推荐歌曲 </a>
      </div>
      <!-- 对应的内容区域 -->
      <div class="tab-content"></div>
    </div>
  </div>
</template>

<script>
import MySwiper from './MySwiper.vue'
export default {
  components: {
    MySwiper
  }
};
</script>

<style scoped>
/* 这里的 @ 符号代表的当前项目的 src 路径，路径别名 */
@import "@/assets/css/index.css";
</style>